import React, { Suspense, lazy } from 'react'
import { HashRouter as Router, Route, Switch } from 'react-router-dom'

import AuthRoute from './AuthRoute'

const LoginPage = lazy(() => import('../pages/LoginPage'));
const EntryPage = lazy(() => import('../pages/EntryPage'));
const CourseListPage = lazy(() => import('../pages/CourseListPage'));
const ShowPage = lazy(() => import('../pages/ShowPage'));
const ShowPageBT = lazy(() => import('../pages/ShowPageBT'));



const Test = lazy(() => import('../pages/Test'));
const Creating = lazy(() => import('../pages/Creating'));

const ChapterListPage = lazy(() => import('../pages/ChapterListPage'));

const Entry02 = lazy(() => import('../pages/Entry02'));
const Entry03 = lazy(() => import('../pages/Entry03'));
const Entry04 = lazy(() => import('../pages/Entry04'));
const Entry05 = lazy(() => import('../pages/Entry05'));


const Entry0501 = lazy(() => import('../pages/Entry0501'));
const ImgShow = lazy(() => import('../pages/ImgShow'));

import { TopHeader } from '../components';

import { Icon, message, Button, Modal } from 'antd';


const Routes = () => (
    <Router>
        {/* fallback={<div className="loginMask">正在拼命加载...</div>} */}
        <Suspense fallback={<Icon className="loginMask" type="loading" style={{ fontSize: '100px', color: 'white' }} />}>
            <TopHeader />
            <Switch>
                <AuthRoute exact path="/entry" component={EntryPage} />
                <AuthRoute path="/login" component={LoginPage} />

                <AuthRoute path="/courseList" component={CourseListPage} />
                <AuthRoute path="/chapterList/:directoryId" component={ChapterListPage} />

                {/* 课程 */}
                <AuthRoute path="/showCourse/:directoryId" component={ShowPage} />



                {/* 即查即练 */}
                <AuthRoute path="/showCourse" component={ShowPage} />

                {/* 碑贴 */}
                <AuthRoute path="/showBeiTie/:directoryId" component={ShowPageBT} />


                <AuthRoute path="/creating/:id" component={Creating} />
                <AuthRoute path="/creating" component={Creating} />


                <AuthRoute path="/entry_02" component={Entry02} />
                <AuthRoute path="/entry_03" component={Entry03} />
                <AuthRoute path="/entry_04" component={Entry04} />

                <AuthRoute path="/entry_05/:type" component={Entry05} />
                <AuthRoute path="/entry_05" component={Entry05} />

                <AuthRoute path="/entry_0501/:type/:index" component={Entry0501} />

                <AuthRoute path="/img_show/:img_url" component={ImgShow} />



                <AuthRoute exact path="/" component={EntryPage} />

            </Switch>
        </Suspense>
    </Router>
)

export default Routes;